<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>悠悠有品</title>

    <link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/1.css') }}">

    <style>
.center {
    background-image: url(../static/imgs/index.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 1000px;
}
    </style>
</head>
<body>
<div class="head">
    <ul class="nav nav-pills">
        <li class="nav-item">
            <a class="nav-link active" href="">首页</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="http://127.0.0.1:5000/sp/">商品</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="http://127.0.0.1:5000/sell/">我也要卖</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="http://127.0.0.1:5000/buyAdmin/">我的购买</a>
        </li>
        {% if user %}
            <li class="nav-item">
                <a class="nav-link" href="http://127.0.0.1:5000/admin/">欢迎您：{{ user.name }}，剩余余额：{{ user.balance }}</a>
            </li>
            <li class="nav-item">
                <a class="nav-link"href="http://127.0.0.1:5000/logout/">注销</a>
            </li>
        {% else %}
            <li class="nav-item">
                <a class="nav-link"href="http://127.0.0.1:5000/login/">登录</a>
            </li>
        {% endif %}
            <li class="nav-item">
                <a class="nav-link" href="http://127.0.0.1:5000/echarts/">数据展示</a>
            </li>
    </ul>


</div>
<div class="center">
    <div class="center-item">
        <div class="card" style="width: 18rem;">
            <img src="../static/imgs/spimgs/图片1.png" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">AWP | 巨龙传说</h5>
                <p class="card-text">
                    高风险，高回报，恶名昭彰的 AWP 因其标志性的枪声和一枪一个的准则而为人熟知。 这把武器使用凯尔特龙的图案进行了自定义涂装。200
                    把钥匙绝对无法解开它的秘密
                    古堡激战收藏品
                </p>
                <a href="#" class="btn btn-primary">61200.02¥ 购买</a>
            </div>

        </div>
    </div>

    <div class="center-item">
        <div class="card" style="width: 18rem;">
            <img src="../static/imgs/spimgs/图片2.png" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">AWP | 二西莫夫</h5>
                <p class="card-text">
                    高风险，高回报，恶名昭彰的 AWP 因其标志性的枪声和一枪一个的准则而为人熟知。 这把武器使用科幻
                    设计进行了自定义涂装。平凡人预测未来… 梦想家塑造未来凤凰收藏品.
                </p>
                <a href="#" class="btn btn-primary">981.95¥ 购买</a>
            </div>

        </div>
    </div>
    <div class="center-item">
        <div class="card" style="width: 18rem;">
            <img src="../static/imgs/spimgs/图片3.png" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">AWP | 永恒之枪</h5>
                <p class="card-text">
                    高风险，高回报，恶名昭彰的 AWP 因其标志性的枪声和一枪一个的准则而为人熟知。
                    奥丁的长矛附身到这把珠光宝气，通体天蓝的象牙制AWP上。众神之父的武器
                    挪威人收藏品
                </p>
                <a href="#" class="btn btn-primary">50170.25¥ 购买</a>
            </div>

        </div>
    </div>
    <div class="center-item">
        <div class="card" style="width: 18rem;">
            <img src="../static/imgs/spimgs/图片4.png" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">AK-47 | 火神</h5>
                <p class="card-text">
                    强大又可靠，AK-47 是世上最流行的突击步枪之一。近距离内控制好的短点射极为致命。 这把武器使用运动风格的设计进行了自定义涂装。
                </p>
                <a href="#" class="btn btn-primary">1699.62¥ 购买</a>
            </div>

        </div>
    </div>
    <div class="center-item">
        <div class="card" style="width: 18rem;">
            <img src="../static/imgs/spimgs/图片5.png" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">M4A4 | 活色生香</h5>
                <p class="card-text">
                    与同级的 AK-47 相比更精准，但杀伤力更低，M4A4 是反恐精英可选的全自动突击步枪。
                    这把武器采用荧光色进行了自定义涂装，辅以手绘的设计图案。为一人而战，为所有人而战
                </p>
                <a href="#" class="btn btn-primary">250.77¥ 购买</a>
            </div>

        </div>
    </div>
    <div class="center-item">
        <div class="card" style="width: 18rem;">
            <img src="../static/imgs/spimgs/图片6.png" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">法玛斯（StatTrak™） | 纪念碑</h5>
                <p class="card-text">
                    该物品具有 StatTrak™ 技术，在其所有者装备时能跟踪若干统计数据。
                    该物品记录已认证杀敌数。
                    给手头紧的玩家的一个廉价选择，法玛斯有效地填补了昂贵的步枪和杀伤力较低的微型冲锋枪之间的空缺。
                    这把武器使用了自定义涂装，通体黄金，丰富的游戏元素点缀其间，以纪念反恐精英系列20年的成长历程。现在要奔三了！
                </p>
                <a href="#" class="btn btn-primary">559.13¥ 购买</a>
            </div>

        </div>
    </div>
    <div class="center-item">
        <div class="card" style="width: 18rem;">
            <img src="../static/imgs/spimgs/图片7.png" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">沙漠之鹰 | 印花集</h5>
                <p class="card-text">
                    杀伤力和它的卖价一样高，沙漠之鹰是一把很难驾驭，而在远距离又出乎意料精准的经典手枪。
                    这把武器使用鲜明的黑白色调设计进行了自定义涂装，最后用珍珠般高光加以点缀。白色；黑色；珍珠色；
                </p>
                <a href="#" class="btn btn-primary"> 647.14¥ 购买</a>
            </div>

        </div>
    </div>
    <div class="center-item">
        <div class="card" style="width: 18rem;">
            <img src="../static/imgs/spimgs/图片8.png" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">沙漠之鹰 | 大佬龙</h5>
                <p class="card-text">
                    杀伤力和它的卖价一样高，沙漠之鹰是一把很难驾驭，而在远距离又出乎意料精准的经典手枪。
                    巨龙的图案被激光蚀刻在滑套和握把上。友佳子，我特别欣赏你做出来的武器，我们应该谈谈… -竞争者赫胥黎
                </p>
                <a href="#" class="btn btn-primary">261.17¥ 购买</a>
            </div>

        </div>
    </div>
    <div class="center-item">
        <div class="card" style="width: 18rem;">
            <img src="../static/imgs/spimgs/图片8.5.png" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">A锯齿爪刀（★） | 渐变之色</h5>
                <p class="card-text">
                    这把象牙把手的爪子刀搭配了铜钉和锯齿刀背，以达到进刀切割、出刀撕裂的效果。
                    这把武器以铬为外表，使用喷笔涂上了相互渐变的透明涂装。这不仅仅是一把武器，更是一种潮流 - 实习军火商伊莫金
                </p>
                <a href="#" class="btn btn-primary">11676.73¥ 购买</a>
            </div>

        </div>
    </div>

    <div class="center-item">
        <div class="card" style="width: 18rem;">
            <img src="../static/imgs/spimgs/图片9.png" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">CZ75 | 翡翠色调</h5>
                <p class="card-text">
                    一把全自动的 CZ75 手枪变种，在扭转局势以及获取敌人武器时，CZ75 自动手枪是一个短期的理想选择。但弹夹中的弹药极少，你需要节约每一发子弹。
                    这把武器使用铬外表，通过半透明的翡翠电镀处理进行了涂装。伟大的塞巴斯蒂安.轩尼奎特竟以沦落到如此地步了吗？一个唠叨不停的老学究？你到底是怎么了……
                    -《导师与偶像破坏者（下）》
                </p>
                <a href="#" class="btn btn-primary">195.52¥ 购买</a>
            </div>

        </div>
    </div>

</div>
</body>
</html>